<template>
	<view class="pages" ref="pageContent" id="pageContent">
		
		<!-- 头部 -->
		<pagehead :back="1">推广分享</pagehead>
		<!-- #ifdef APP-PLUS -->
		<html2canvas ref="html2canvas" :domId="domId" @renderFinish="renderFinish">
		<view class="share">
			<image :src="IMAGE_STATIC+'/userimage/share-bg.png'" class="bg"></image>
			<view class="content-bg">
			<image :src="IMAGE_STATIC+'/userimage/share-title.png'" class="title" mode="widthFix"></image>
			<view class="content">
				<view class="qrocde" @tap.stop="inviteImgShow = true">
					<image v-if="ewmImg != ''" :src="ewmImg" mode="" class="image"/>
				</view>
				<view class="info">
						<view class="txt">拓展码</view>
						<view class="code">
							{{usermsg.uid?usermsg.uid:''}}
						</view>
						<!-- <view class="copy" @click="$tools.copy(usermsg.uid)">复制</view> -->
				</view>
			</view>
			</view>
		</view>
		</html2canvas>
		<!-- #endif -->
		<!-- #ifndef  APP-PLUS  -->
		<view class="share">
			<image :src="IMAGE_STATIC+'/userimage/share-title.png'" class="title" mode="widthFix"></image>
			<view class="content">
				<view class="qrocde" @tap.stop="inviteImgShow = true">
					<image v-if="ewmImg != ''" :src="ewmImg" mode="" class="image"/>
				</view>
				<view class="info">
						<view class="txt">拓展码</view>
						<view class="code">
							{{usermsg.uid?usermsg.uid:''}}
						</view>
						<!-- <view class="copy" @click="$tools.copy(usermsg.uid)">复制</view> -->
				</view>
			</view>
		</view>
		<!-- #endif -->
		<view v-if="inviteImgShow" ref="sortPopu" class="model-bg" @tap="inviteImgShow = false">
			<view class="modal" @tap.stop="inviteImgShow = true">
				<view class="ul">
					<!-- #ifdef MP-WEIXIN -->
					<view class="li" @tap.stop="saveHB1()">保存图片</view>
					<button class="li" open-type="share">分享</button>
					<!-- #endif -->
					<!-- #ifndef MP-WEIXIN -->
					<view class="li" @tap.stop="saveHB()">保存图片</view>
					<button class="li" @tap.stop="shareWeinx()">分享</button>
					<!-- #endif -->
				</view>
				<view class="ul">
					<view class="li"  @tap.stop="inviteImgShow = false">取消</view>
				</view>
			</view>
		</view>
		<!-- #ifdef MP-WEIXIN -->
		<poster ref="poster" :list="list" background-color="#FFF" :width="canvasW*2" :height="canvasH*2"
            @on-success="posterSuccess" @on-error="posterError" style="opacity: 0;    position: absolute;
    top: 100%;z-index: -1;"></poster>
		<!-- <canvas :style="{ width: canvasW + 'px', height: canvasH + 'px',
		opacity: 1,position: 'absolute',top: 0,left: 0,'z-index':'-1' }"
					canvas-id="myCanvas" id="myCanvas"></canvas> -->
					<!-- <image
			:src="poster"
			mode="scaleToFill"
			width="100%" height="100%"
			style="width:100vw;height:100vh;position: absolute;top: 0;left: 0;z-index: -1;opacity: 0 "
		/> -->
		<!-- #endif -->
		<!-- #ifdef H5 -->
		<iframe ref="iframe" :src="`${webViewSrc}`" width="100%" height="100%" frameborder="0" style=""></iframe>
		<!-- #endif -->

	</view>
</template>

<script>
// #ifdef APP-PLUS || H5
import html2canvas from './components/html2canvas/html2canvas.vue'
// #endif
	import QR from './qrcode/qrcode';
	// import html2canvas from 'html2canvas';
	// #ifdef MP-WEIXIN
	import Poster from './components/zhangyuhao-poster/Poster.vue';
	// #endif
	export default {
		components:{ 
			// #ifdef APP-PLUS || H5
			html2canvas,
			// #endif
			// #ifdef MP-WEIXIN
			Poster
			// #endif
		},
		data(){
			return{
				IMAGE_STATIC: this.$url.assetsPath,
				IMAGE_PREFIX: this.$url.urlPath,
				domId: '',
				inviteList: [],
				pageIndex: 1,
				pageSize: 10,
				usermsg: {},
				appkey: '',
				access_token: '',
				openlink: '',
				wxaqrcodeObj: {},
				size: 100,
				
				inviteImgShow: false,
				canvasW: 0, // 画布宽
				canvasH: 0, // 画布高
				picWidth: '', //图片宽
				picHight: '', //图片高
				SystemInfo: {}, // 设备信息
				goodsImg: {}, // 主图
				ewmImg: '', // 二维码图片
				ewmW: 160, // 二维码大小
				hbUrl: ''  ,// 保存的图片地址
				ewmImg2: '',
				shareUrl: '',
				shareImg: '',
				inviteImgShow1:false,
				poster:'',
				jiazai:false,
				list:[],
				ctx: '',
				img1Path:this.$url.assetsPath+'/userimage/share-bg1.png',
				shareTitlePath:this.$url.assetsPath+'/userimage/share-title.png',
				image1:'',
				x1:0,
				y1:0,
				x2:0,
				y2:0,
				x3:0,
				y3:0,
				qrWidth:0,
				twidth:0,
				theight:0,
			}
		},
		onLoad() {
			this.usermsg = uni.getStorageSync('usermsg');
			console.log("usermsg：",this.usermsg);
			// #ifdef MP-WEIXIN || MP
			// this.getAppKey();
			// #endif
			// uni.showShareMenu({
			// 	//小程序的原生菜单中显示分享按钮，才能够让发送给朋友与分享到朋友圈两个按钮可以点击
			// 	menus:["shareAppMessage","shareTimeline"] //不设置默认发送给朋友
			// })
		},
		onShareAppMessage(res) {
			if (res.from === 'button') {// 来自页面内分享按钮
			  console.log('button',res.target);
			}
			if (res.from === 'menu') {// 来自页面内分享按钮
			  console.log('menu',res.target);
			}
			return {
				title: '启航掌柜',
				// path: '/pages/index/index?inviteUserId='+ this.globalData.userId,  // 路径，传递参数到指定页面。
				path: '/pagesMain/index/index?inviteUserId='+ this.usermsg.uid,  // 路径，传递参数到指定页面。
				imageUrl: this.IMAGE_STATIC+'/images/logo.png',     //自定义图片路径，可以是本地文件路径、代码包文件路径或者网络图片路径，支持PNG及JPG，不传入 imageUrl 则使用默认截图。显示图片长宽比是 5:4
			}
		},
		onShow() {
			this.init();
		},
		mounted() {
			// #ifdef  APP-PLUS 
			this.$nextTick(() => {
			    // 确保视图完全渲染
				this.domId = '.share'
			});
			// #endif
			// #ifdef H5
			// 监听iframe页面点击按钮触发事件
			window.addEventListener('message', (event) => {
				const data = event.data.data;
				// console.log('data',data)
				if (data.code === 'success') {
					console.log('iframe',data)
					this.poster = data.src
					uni.hideLoading(); 
				}
			})
			// #endif
		},
			created(){
				// #ifdef MP-WEIXIN 
			// 生成图片
			this.$nextTick(async() => {
					// 视情况而定是否要使用 $nextTick()
					// this.$refs.poster.create();
					const that = this
					uni.createSelectorQuery().in(this).select('.title').boundingClientRect(data => {
					if (data) {
						// data包含元素的位置信息，如data.top, data.left等
						console.log('元素的位置1：', data);
						that.x=data.left
						that.y=data.top - 44
						that.twidth=data.width
						that.theight=data.height
					}
				}).exec();
				uni.createSelectorQuery().in(this).select('.txt').boundingClientRect(data => {
					if (data) {
						// data包含元素的位置信息，如data.top, data.left等
						console.log('元素的位置2：', data);
						that.x1=data.width 
						that.y1=data.top
					}
				}).exec();
				uni.createSelectorQuery().in(this).select('.code').boundingClientRect(data => {
					if (data) {
						// data包含元素的位置信息，如data.top, data.left等
						console.log('元素的位置3：', data);
						that.x2=data.width / 2
						that.y2=data.top
					}
				}).exec();
				uni.createSelectorQuery().in(this).select('.qrocde').boundingClientRect(data => {
					if (data) {
						// data包含元素的位置信息，如data.top, data.left等
						console.log('元素的位置4：', data);
						that.x3=data.left
						that.y3=data.top + 16
						that.qrWidth=data.width
					}
				}).exec();
				// 获取设备信息，获取设备的宽高，画布做一样的高度
				that.SystemInfo = await that.getSystemInfo();
				console.log('that.SystemInfo', that.SystemInfo)
				that.canvasW = that.SystemInfo.windowWidth; // 画布宽度
				that.canvasH = that.SystemInfo.windowHeight; //画布高度
				// that.qrWidth  = that.canvasW / 2.5
				console.log(that.canvasW,that.canvasH,'qrWidth',that.qrWidth)
				that.removeSave()
			})
			// #endif
		},
		methods: {
			// app 生成海报
			renderFinish(filePath) {
				this.poster = filePath;
				if(filePath!=''){
					this.jiazai=true
				}
				//blob格式转换为base64格式
				// this.blobToBase64(filePath, function (result) {
				// 		// 这里面写对应的方法
				// 		// result是转换后的数据
				// 		console.log('result',result)
				// });
				console.log("filePath", filePath)
			},
			// 微信小程序生成图片报错
			posterError(err) {
				console.log(err)
			},
			// 微信小程序生成图片完成
			posterSuccess(url) {
				const that = this
				// 生成成功，会把临时路径在这里返回
				this.poster = url;
				console.log('poster',this.poster)
				if(this.poster){
					uni.hideLoading(); 
					uni.saveImageToPhotosAlbum({ // 保存本地
						filePath: this.poster,
						success: (response) => {
							uni.showToast({
								title: '保存成功',
								icon: 'success'
							})
							that.inviteImgShow = false
							that.removeSave()
							console.log(response, 'success');
						},
						fail: (response) => {
							console.log(response, 'error');
							uni.openSetting({ //打开权限
								success: (response) => {
									if (!response.authSetting['scope.writePhotosAlbum']){
											uni.showToast({
												title: '获取权限成功, 再次点击即可保存',
												icon: none
										})
									} else {
										uni.showToast({
											title: '获取权限失败, 无法保存',
											icon: none
										})
									}
								}
							})
						}
					})
				}
			},
			// 微信小程序生成图片
			async start() {
				const that = this
				// 假设base64Data是你的base64位二维码数据
				// let base64Data =this.ewmImg.replace(/^data:image\/\w+;base64,/, "");//去掉data:image/png;base64;
				// 将base64转换为临时文件路径
				var urlQR = await this.base64ToSave(this.ewmImg);
				var urlContent= this.urlContent
				console.log('urlQR',urlQR)
				console.log('urlContent',urlContent)
					// 赋值需要渲染的信息
					this.list = [{
							type: 'image',
							// path替换成你自己的图片，注意需要在小程序开发设置中配置域名
							path: this.img1Path,
							x: 0,
							y: 0,
							width: that.canvasW * 2,
							height: that.canvasH * 2
					},
					{
							type: 'image',
							path: urlQR,
							// x: (that.canvasH - that.qrWidth) / 2,
							x:that.x3*2,
							y: that.y3 * 2,
							width: that.qrWidth*2,
							height: that.qrWidth*2
					},
					{
							type: 'image',
							path: this.shareTitlePath,
							x: that.x * 2,
							y: that.y * 2,
							width: that.twidth*2,
							height: that.theight*2,
					},
					{
							type: 'text',
							x: that.canvasW,
							y: (that.y1 * 2),
							text: '拓展码',
							size: 24,
							color: '#000'
					},
					{
							type: 'text',
							x: that.canvasW,
							y: (that.y2 * 2),
							text: that.usermsg.uid,
							size: 48,
							color: '#000'
					}
					];
					// 生成图片
					this.$nextTick(() => {
						// 要放在$nextTick()里，不然会空白
						this.$refs.poster.create();
					})
			},
			//base64转本地图片，将数据存储在本地
			base64ToSave(base64data,FILE_BASE_NAME='tmp_base64src') {
				const fsm = uni.getFileSystemManager();
				return new Promise((resolve, reject) => {
				//format这个跟base64数据的开头对应
					const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(base64data) || [];
					if (!format) {
						reject(new Error('ERROR_BASE64SRC_PARSE'));
					}
					const filePath = `${wx.env.USER_DATA_PATH}/${FILE_BASE_NAME}.${format}`;
					const buffer = wx.base64ToArrayBuffer(bodyData);
					fsm.writeFile({
						filePath,
						data: buffer,
						encoding: 'binary',
						success() {
							resolve(filePath);
						},
						fail() {
							reject(new Error('ERROR_BASE64SRC_WRITE'));
						},
					});
				});
			},
			// 制作完海报后删除本地数据
			 removeSave (FILE_BASE_NAME='tmp_base64src',format='jpg') {
				return new Promise((resolve)=>{
					// 把文件删除后再写进，防止超过最大范围而无法写入
					const fsm = uni.getFileSystemManager();  //文件管理器
					const FILE_BASE_NAME = 'tmp_base64src';
					const format = 'gif';
					const filePath = `${wx.env.USER_DATA_PATH}/${FILE_BASE_NAME}.${format}`;
					fsm.unlink({
						filePath: filePath,
						success(res) {
							console.log('文件删除成功');
						},
						fail(e){
							console.log('readdir文件删除失败：',e)
						}
					});
				})

			},
			init(){
				const real_name = this.usermsg.real_name || ''
				this.shareUrl = this.IMAGE_STATIC +'/#/?invite='+ this.usermsg.uid;
				console.log(this.shareUrl);
				this.ewmImg = this.creatQrcode(this.shareUrl);
				this.hbUrl = this.ewmImg
				// this.webViewSrc = 'http://127.0.0.1:5500/%E6%98%93%E4%BC%97%E9%82%A6%E9%82%80%E8%AF%B7%E6%B3%A8%E5%86%8C/static/html2canvas/html2canvas.html?real_name='+this.usermsg.real_name
				this.webViewSrc = this.IMAGE_STATIC+'/html2canvas/html2canvas.html?real_name='+this.usermsg.real_name
				// this.webViewSrc = '/static/html2canvas/html2canvas.html?real_name='+this.usermsg.real_name
				+'&uid='+this.usermsg.uid+'&shareUrl='+this.IMAGE_STATIC
			},
			creatQrcode(url) {
				if (url == '') {
					return false;
				}
				let img = QR.createQrCodeImg(encodeURI(url));

				return img;
			},
			showImg(){
				this.inviteImgShow = true;
				this.getMyCanvas();
			},
			 saveHB1(){
				const that = this
				uni.showLoading({
					mask:true,
					title: '海报生成中'
				})
				this.start()
				// console.log('poster',this.poster)
				
			},
			saveHB() {
				uni.showLoading({
					mask:true,
					title: '海报生成中'
				})
				const that = this
				console.log('poster',this.poster)
				 // #ifdef H5
				this.exportImage(this.poster)
				 // #endif

				// #ifdef APP-PLUS || H5
				// 假设base64Data是你的图片的base64编码字符串
				// this.saveAppImg(this.poster)
				console.log("poster", this.poster)
				uni.saveImageToPhotosAlbum({
						filePath: this.poster,
						success: function() {
							that.inviteImgShow = false
							that.$tools.toast('图片已保存到相册')
						},
						fail:(err)=>{
							console.log(err)
							that.inviteImgShow = false
							that.$tools.toast('图片保存失败',err.message)
						},
					});
				// #endif
				uni.hideLoading(); 
			},
			// app端保存图片
			saveAppImg(base64str){
				const that = this
				const bitmap = new plus.nativeObj.Bitmap("test");
						// 从本地加载Bitmap图片
				bitmap.loadBase64Data(base64str, function() {
					const url = "_doc/imageName_" + (new Date()).getTime() + ".png";  // url为时间戳命名方式
					console.log('url',url)
					bitmap.save(url, {
							overwrite: true,  // 是否覆盖
							// quality: quality  // 图片清晰度
					}, (i) => {
							uni.saveImageToPhotosAlbum({
									filePath: url,
									success: function() {
										that.$tools.toast('图片已保存到相册')
									}
							});
							that.inviteImgShow = false
					}, (err) => {
						console.log(err)
						that.inviteImgShow = false
						that.$tools.toast('图片保存失败',err.message)
					});
				}, (err) => {
					console.log(err)
					that.inviteImgShow = false
					that.$tools.toast('图片保存失败',err.message)
				});
				uni.hideLoading(); 
			},
			// h5下载图片
			exportImage(base64str, fileName) {
				uni.hideLoading(); 
				// 将base64格式的图片转换成Blob对象
				var arr = base64str.split(","),
					mime = arr[0].match(/:(.*?);/)[1],
					bstr = atob(arr[1]),
					n = bstr.length,
					u8arr = new Uint8Array(n);
				while (n--) {
					u8arr[n] = bstr.charCodeAt(n);
				}
				// 将Blob对象转换成文件并下载到本地
				var blob = new Blob([u8arr], {
					type: 'image/png'
				});
				console.log('blob',blob)
				var a = document.createElement('a');
				a.download = 'imageName';
				a.href = URL.createObjectURL(blob);
				a.click();
				this.inviteImgShow = false
			},
			// 微信小程序授权之后保存图片功能
			downSaveImage(imgurl) {
				const that = this
				uni.getImageInfo({
					src: imgurl,
						success: function(res) {
						let path = res.path;
						console.log('path',res)
						uni.saveImageToPhotosAlbum({
							// filePath: wx.env.USER_DATA_PATH + '/imageName.png',
							filePath: path,
							success: function() {
									//保存成功
									console.error('图片已保存到相册:', wx.env.USER_DATA_PATH);
									that.$tools.toast('图片已保存到相册')
									that.inviteImgShow = false
							},
							fail: function(err) {
									//保存失败
									console.error('保存图片失败：', err);
									that.$tools.toast('保存图片失败：'+err.errMsg)
									that.inviteImgShow = false
							}
						})
					}
				})
			},
			// H5或app 端分享
			shareWeinx(){
				let path = 'pagesMain/index/index'
				let query=''
				// #ifdef APP-PLUS
				// 分享图文
				uni.share({
					provider: "weixin",
					scene: "WXSceneSession",
					type: 0,
					href: this.$url.urlPath,
					title: "启航掌柜",
					summary: "启航掌柜自主创新网络诚信体系，秉承“公平公正、诚信、双赢”的理念，利用自身开发优势，构架支付规范模型。",
					imageUrl:  this.$url.assetsPath+'/images/logo.png',
					success: function (res) {
						console.log("success:" + JSON.stringify(res));
					},
					fail: function (err) {
						console.log("fail:" + JSON.stringify(err));
					}
				});
				// 分享到小程序
				// uni.share({
				// provider: 'weixin',
				// scene: "WXSceneSession", //分享类型（聊天，朋友圈）
				// type: 5,//类型 
				// title: "启航掌柜",
				// imageUrl: this.$url.assetsPath+'/images/logo.png',//不能大于20kb
				// miniProgram: {
				// 	id: "gh_32ee067a8084",//小程序原始ID
				// 	path: "pagesMain/index/index",//小程序页面路径，传参也是?拼接
				// 	webUrl: this.$url.urlPath,//地址
				// 	type: 2 //微信小程序版本类型，可取值： 0-正式版； 1-测试版； 2-体验版。 默认值为0。
				// },
				// success: res => {
				// 	console.log(res);
				// },
				// fail: function(err) {
				// 		console.log(err);
				// }
				// });
				// #endif
				// #ifdef H5
				// const url = this.$url.urlPath
				// location.href = url;
				let ENV_VERSION = ''
				location.href = `weixin://dl/business/?appid=wx8680e48d44da9d29&path=${path}&query=${query}&env_version=${ENV_VERSION}`
				// #endif
			},
			blobToBase64 (blob, callback){
				var reader = new FileReader();
				reader.readAsDataURL(blob);
				reader.onload = function (e) {
					callback(e.target.result);
				};
			},
			// 获取图片信{息
			getImageInfo(image) {
				return new Promise((req, rej) => {
					uni.getImageInfo({
						src: image,
						success: (res) => {
							req(res)
						},
					});
				})
			},
			// 获取设备信息
			getSystemInfo() {
				return new Promise((req, rej) => {
					uni.getSystemInfo({
						success: function(res) {
							req(res)
						}
					});
				})
			},
			// 生成二维码
			createwxaqrcode(){
				let that = this;
				that.$Ajax('/userinfo/app/getUnlimitedQRCode',{
					// path: 'pages/index/index?inviteUserId='+ that.usermsg.userId, // 必须是已经发布的小程序存在的页面（否则报错）,that.code就是邀请码
					page: 'pagesMain/index/index', // 必须是已经发布的小程序存在的页面（否则报错）,that.code就是邀请码
					scene: that.usermsg.userId, 
					// scene: "inviteUserId=" + that.usermsg.userId, 
				},res => {
					that.ewmImg = "data:image/PNG;BASE64," + uni.arrayBufferToBase64(res.data); //以图片的形式展示
					// that.ewmImg = "data:image/png;base64," + res.data; //以图片的形式展示
					// console.log("ewmImg：",that.ewmImg);
					// const fs = uni.getFileSystemManager();
					//随机定义路径名称
					// var times = new Date().getTime();
					// var codeimg = wx.env.USER_DATA_PATH + '/' + times + '.png';
					//将base64图片写入
					// fs.writeFile({
					// 	filePath: codeimg,
					// 	data: that.ewmImg.slice(22),
					// 	encoding: 'base64',
					// 	success: (res) => {
					// 		console.log('codeimg',codeimg)
					// 		that.ewmImg2 = codeimg;
					// 	}
					// });
				},err =>{},'GET')
			},
			share1(){
				let that = this;
				console.log('我是分享');  //打印出来的就是:data-item='item'里的'item'值
				let times = new Date().getTime();
				let url = 'https://api.anyueqc.cn/share/share.html?inviteUserId='+ this.usermsg.userId+'&times='+times;
				that.$tools.copy(url);
				console.log("openlink：",that.openlink);
				// that.$tools.copy(url);
				location.href = 'weixin://dl/business/?inviteUserId='+ this.usermsg.userId
			},
			getApp(){
				let that = this;
				uni.request({
					url: 'https://api.weixin.qq.com/wxa/generatescheme?access_token='+that.access_token,
					method:'POST',
					data: {
						"jump_wxa":{
							"path": "pagesMain/index/index",   //  pages前面不能有斜杠
							"query": "?inviteUserId="+ this.usermsg.userId,
							// "envVersion": "develop",   // 正式版为"release"，体验版为"trial"，开发版为"develop"，
						},
						"is_expire":false,
						// "env_version": "develop"
					},
					success(res) {
						console.log('openlink', res)
						if(res.data.errmsg == 'ok'){
							that.openlink = res.data.openlink;
						}
					},
					fail(err) {
						console.log("data:",data,typeof(data));
						console.log('err', err);
					}
				})
			},
			getAccessToken(){
				let that = this;
				uni.request({
					url: 'https://api.weixin.qq.com/cgi-bin/token',
					method:'GET',
					data: {
						appid: that.$url.wxId,
						secret: that.appkey,
						grant_type: "client_credential",
					},
					success(res) {
						console.log('access_token', res)
						that.access_token = res.data.access_token;
						that.getApp();
						// that.createwxaqrcode();
					},
					fail(err) {
						console.log('err', err);
					}
				})
			},
			getAppKey(){
				let that = this;
				that.$Ajax('/userinfo/app/config',{},res => {
					if (res.code == 200) {
						that.appkey = res.data.appSecret;
						that.getAccessToken();
					}
				},err =>{},'GET')
			},
			// 邀请用户列表
			getInviteList() {
				let that = this;
				that.$Ajax('/userinfo/inviteList', {
					pageIndex: that.pageIndex,
					pageSize: that.pageSize
				}, res => {
					if(res.code == 200){
						that.pages = res.data.pages;
						that.inviteList = that.inviteList.concat(res.data.list);
					}
				}, err => {}, 'GET')
			},
			lower(e) {
				console.log("ddd")
				if (this.pageIndex >= this.pages) {
					return this.$tools.toast('到底了');
				} else {
					this.pageIndex++;
					console.log("+++")
					this.getInviteList();
				}
			},
			/* 弹出框公用 */
			openPopup(e) {
				this.$refs[e].open();
			},
			hidePopup(e) {
				this.$refs[e].close();
			},
			changePopup(e) {
				this.typePopup = e.type;
				console.log('popup ' + e.type + ' 状态', e.show);
			},
		},
		onPullDownRefresh() {
			console.log('refresh');
			setTimeout(function () {
				uni.stopPullDownRefresh();
			}, 1000);
		}
	}
</script>

<style lang="scss" scoped>
	/deep/ .header_fixed{
		background: none !important;
	}
	/deep/ .header_fixed{
		background: none   !important;
	}
	.share{
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 3;
		// z-index: -1;
		/* #ifndef APP-PLUS */
		background: url($uni-static-dir+'/userimage/share-bg.png') 100% no-repeat;
		background-repeat: no-repeat;
		background-size: 100% 100%;
		/* #endif */

		// opacity: 0;
	}
	.bg{
			width: 100%;
			height: 100%;
			position: absolute;
			top: 0;
			left: 0;
		}
	iframe,web-view{
		opacity: 0;
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		z-index: 1;
	}
	.pages{
		width: 100%;
		height: 100vh;
		// background: url($uni-static-dir+'/userimage/share-bg.png') 100% no-repeat;
		// background-repeat: no-repeat;
		// background-size: 100% 100%;
		// height: 620rpx;
		// position: absolute;
		// /*  #ifdef H5 || APP-PLUS  */
		// top: -80rpx;
		// /*  #endif   */
		// /*  #ifdef MP-WEIXIN  */
		// top: -76rpx;
		// /*  #endif   */
		.content-bg{
			height: 100%;
			width: 100%;
			position: absolute;
			top: 0;
			left: 0;
		}
		.title{
			width: 496rpx;
			height: 62rpx;
			margin: 38rpx;
			margin-top: 160rpx;
			/* #ifdef MP-WEIXIN */
			margin-top: calc(160rpx + var(--status-bar-height));
			/* #endif */
			img{
				width: 100%;
			}
		}
		.content{
			width: 674rpx;
			height: 756rpx;
			background: #fff;
			border-radius: 32rpx;
			margin: auto;
			margin-top: 54rpx;
			overflow: hidden;
			// position: absolute;
			// top: 88rpx;
			// left: 0;
		}
		.info{
			// margin-top: 178rpx;
			text-align: center;
			.avatar{
				width: 108rpx;
				height: 108rpx;
				margin: auto;
				border-radius: 100%;
			}
			.name{
				margin-top: 16rpx;
				font-weight: 600;
				font-size: 28rpx;
				color: #333333;
				line-height: 33rpx;
			}
			.txt{
				margin-top: 26rpx;
				font-size: 24rpx;
				color: #333333;
				line-height: 28rpx;
			}
			.code{
				margin-top: 36rpx;
				font-family: Inter, Inter;
				font-weight: bold;
				font-size: 46rpx;
				color: #333333;
				line-height: 46rpx;
			}
			.copy{
				width: 150rpx;
				text-align: center;
				margin: auto;
				margin-top: 40rpx;
				height: 50rpx;
				line-height: 50rpx;
				border-radius: 20rpx;
				background: #AD2926;
				font-size: 30rpx;
				color: #FFFFFF;
				border-radius: 72rpx;
			}
		}
		.qrocde{
			width: 372rpx;
			height: 380rpx;
			margin: auto;
			margin-top: 100rpx;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			border: 2rpx solid #D74B56;
			padding: 32rpx 28rpx;
			.image{
				width: 316rpx;
				height: 316rpx;
				margin: auto;
				/* #ifdef MP-WEIXIN */
				padding: 32rpx 28rpx;
				/* #endif */
			}
		}
	}
	.model-bg{
		top: 0;
		background-color: rgba(0, 0, 0, 0.4);
		transition-duration: 0.3s;
	}
	.modal{
		top: auto;
		bottom: 20rpx;
		background: transparent;
		width: 98%;
		left: 1%;
		.ul{
			background: #fff;
			margin-top: 20rpx;
			border-radius: 20rpx;
			overflow: hidden;
			.li{
				background: #fff;
				text-align: center;
				height: 88rpx;
				line-height: 88rpx;
				// padding: 20rpx 18rpx;
				text-align: center;
				font-size: 36rpx;
				text-overflow: ellipsis;
				overflow: hidden;
				cursor: pointer;
			}
		}
	}
	
	.share{
		// position: relative;
		// z-index: 3;
		&-height{
			height: calc(100vh - 650rpx);
		}
		&-box{
			@include flexCenterColumn;
			position: relative;
			z-index: 3;
		}
		&-title{
			font-size: 36rpx;
			font-family: PingFang SC-Bold, PingFang SC;
			font-weight: bold;
			color: $globalColor-fontStyle;
			margin: 80rpx 0 0rpx;
		}
		&-btn{
			font-size: 36rpx;
			font-family: PingFang SC-Bold, PingFang SC;
			font-weight: bold;
			color: $globalColor-fontStyle;
			border: 1px solid $globalColor-fontStyle;
			padding: 12rpx 90rpx;
			border-radius: 10rpx 10rpx 10rpx 10rpx;
		}
		&-wrapper{
			margin: 100rpx 0 0;
			background: $globalColor-white;
			padding: 40rpx;
		}
		&-header{
			@include flexLeft;
			border-bottom: 1px solid $globalColor-border;
			padding-bottom: 34rpx;
			.tips{
				width: 4rpx;
				height: 32rpx;
				background: #AD2926;
				margin-right: 20rpx;
			}
			.head{
				font-size: 32rpx;
				font-family: PingFang SC-Bold, PingFang SC;
				font-weight: bold;
				color: #333333;
			}
		}
		&-list{
			
		}
		&-item{
			@include flexBetween;
			margin-top: 40rpx;
		}
		&-left{
			@include flexLeft;
			.logo{
				width: 52rpx;
				height: 52rpx;
				margin-right: 20rpx;
				border-radius: 50%;
			}
		}
		&-name{
			font-size: 30rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			color: $globalColor-fontStyle;
		}
		&-time{
			font-size: 30rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			color: #888B95;
		}
	}
	.noStyle{
		width: 396rpx !important;
		padding: 0 !important;
		margin: 30rpx 0 0 !important;
		background: none !important;
		height: 80rpx  !important;
		line-height: 80rpx !important;
	}
</style>